<template>
  <el-pagination
    class="tablePage"
    @size-change="changeSize"
    @current-change="changeCurrent"
    :current-page="page.pageNum"
    :page-size="page.pageSize"
    background
    prev-text="Previous"
    next-text="Next"
    :total="page.total">
  </el-pagination>
</template>

<script>
export default {
  name: 'page',
  props: {
    page: {
      pageNum: 1,
      pageSize: 10,
      total: 0
    }
  },
  data () {
    return {

    }
  },
  methods: {
    changeSize (size) {
      this.page.size = size
      this.$emit('changePage', this.page)
    },
    changeCurrent (current) {
      this.page.pageNum = current
      this.$emit('changePage', this.page)
    }
  }
}
</script>

<style scoped>
.tablePage{
  padding-top: 20px;
  padding-bottom: 20px;
  box-sizing: content-box;
  background: white;
  height: auto!important;
  text-align: right;
}
</style>
